<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
	<title>大麦商城</title>
	<link href="css/slider.css" rel="stylesheet" type="text/css"/>
	<link href="css/common.css" rel="stylesheet" type="text/css"/>
	<link href="css/cart.css" rel="stylesheet" type="text/css"/>
	<script src="https://unpkg.com/vue@2.7.14/dist/vue.min.js"></script>
	<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
	<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"></script>
	<script src="https://unpkg.com/element-ui/lib/index.js"></script>
	<script src="/user/login/js/login.js"></script>
	<script src="/js/damai.js"></script>
</head>
<body>
<div id="app">
	<damai ref="dm">
		<div class="container cart">

			<div class="span24">

				<div class="step step1">
					<ul>

						<li  class="current"></li>
						<li  >生成订单成功</li>
						<li  >订单号:{{order.oid}}</li>
					</ul>
				</div>

				<table>
					<tbody>
					<tr>
						<th>图片</th>
						<th>商品</th>
						<th>价格</th>
						<th>数量</th>
						<th>小计</th>
					</tr>

					<tr v-for=" oi in order.orderitems">
						<td width="60">
							<img :src="oi.product.image"/>
						</td>
						<td>
							<a target="_blank">{{oi.product.pname}}</a>
						</td>
						<td>
							299.0
						</td>
						<td class="quantity" width="60">
							{{oi.count}}
						</td>
						<td width="140">
							<span class="subtotal">￥{{oi.subtotal}}</span>
						</td>
					</tr>

					</tbody>
				</table>
				<dl id="giftItems" class="hidden" style="display: none;">
				</dl>
				<div class="total">
					<em id="promotion"></em>
					商品金额: <strong id="effectivePrice">￥{{order.total}}元</strong>
				</div>
				<form id="orderForm" action="msg.html" method="post">
					<input type="hidden" name="order.oid" value="73"/>
					<div class="span24">
						<p>
							收货地址：<input v-model="order.addr" type="text" value="天子脚下" style="width:350px" />
							<br />
							收货人&nbsp;&nbsp;&nbsp;：<input v-model="order.name" type="text" value="Song" style="width:150px" />
							<br />
							联系方式：<input v-model="order.phone" type="text" value="13283718600" style="width:150px" />

						</p>
						<hr />
						<p>
							选择银行：<br/>
							<input type="radio" name="pd_FrpId" value="ICBC-NET-B2C" checked="checked"/>工商银行
							<img src="bank_img/icbc.bmp" align="middle"/>&nbsp;&nbsp;&nbsp;&nbsp;
							<input type="radio" name="pd_FrpId" value="BOC-NET-B2C"/>中国银行
							<img src="bank_img/bc.bmp" align="middle"/>&nbsp;&nbsp;&nbsp;&nbsp;
							<input type="radio" name="pd_FrpId" value="ABC-NET-B2C"/>农业银行
							<img src="bank_img/abc.bmp" align="middle"/>
							<br/>
							<input type="radio" name="pd_FrpId" value="BOCO-NET-B2C"/>交通银行
							<img src="bank_img/bcc.bmp" align="middle"/>&nbsp;&nbsp;&nbsp;&nbsp;
							<input type="radio" name="pd_FrpId" value="PINGANBANK-NET"/>平安银行
							<img src="bank_img/pingan.bmp" align="middle"/>&nbsp;&nbsp;&nbsp;&nbsp;
							<input type="radio" name="pd_FrpId" value="CCB-NET-B2C"/>建设银行
							<img src="bank_img/ccb.bmp" align="middle"/>
							<br/>
							<input type="radio" name="pd_FrpId" value="CEB-NET-B2C"/>光大银行
							<img src="bank_img/guangda.bmp" align="middle"/>&nbsp;&nbsp;&nbsp;&nbsp;
							<input type="radio" name="pd_FrpId" value="CMBCHINA-NET-B2C"/>招商银行
							<img src="bank_img/cmb.bmp" align="middle"/>
						</p>
						<hr />
						<p style="text-align:right">
							<a href="" @click.prevent="payOrder">
								<img src="images/finalbutton.gif" width="204" height="51" border="0" />
							</a>
						</p>
					</div>
				</form>
			</div>

		</div>
	</damai>
</div>
<script>
	var v = new Vue({
		el : "#app",
		data : {
			order : {orderitems:[]}
		},
		created () {
			axios.get("order/order/findById" + location.search).then(res=>{
				this.order = res.data;
				// 默认的地址信息
				this.order.name = this.order.user.name;
				this.order.addr = this.order.user.addr;
				this.order.phone = this.order.user.phone;
			})
		},
		methods:{
			payOrder(){
				// TODO 保存收货人信息, 更新 state=2
			}
		}
	})
</script>
</body></html>